<template>
	<view>
		<!-- #ifdef APP -->
		<!-- <headerHeight></headerHeight> -->
		<!-- #endif  -->
		<!-- <uni-nav-bar shadow left-icon="left" @clickLeft="handleLeft" title="设置" /> -->
		<view class="cell_4 bg-white" style="padding:20rpx 30rpx; border-radius: 15rpx;">
			<view class="flex justify-between align-center" @click="handleToPath(1)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>个人资料</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(2)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>实名认证</text>
				</view>
				<view>
					<text class="text-green padding-lr-sm text-sm" v-if="authInfo.auth_status ==1 ">认证成功</text>
					<text class="text-grey padding-lr-sm text-sm" v-else-if="authInfo.auth_status ==2 ">认证未通过</text>
					<text class="text-yellow padding-lr-sm text-sm" v-else-if="authInfo.auth_status ==3 ">认证中</text>
					<text class="text-red padding-lr-sm text-sm" v-else>未认证</text>
					<text class="lg text-gray cuIcon-right"></text>
				</view>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(3)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>服务地址</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(4)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>设置密码</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(5)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>注销账户</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
		</view>

		<view class="cell_4 bg-white margin-top-sm" style="padding:20rpx 30rpx; border-radius: 15rpx;">
			<view class="flex justify-between align-center" @click="handleToPath(6)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>投诉中心</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(7)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>帮助中心</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<!-- <view class="flex justify-between align-center" @click="handleToPath(8)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>关注公众号</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view> -->
			<view class="flex justify-between align-center" @click="handleToPath(9)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>用户协议</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<view class="flex justify-between align-center" @click="handleToPath(10)">
				<view class="flex justify-center align-center padding-left-xs">
					<text>隐私政策</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
		</view>
		<!-- <view class="cell_4 bg-white margin-top-sm" style="padding:20rpx 30rpx; border-radius: 15rpx;">
			<view class="flex justify-between align-center" @click="onUpdata">
				<view class="flex justify-center align-center padding-left-xs">
					<text>版本更新</text>
				</view>
				<view>
					<text class="text-grey padding-lr-sm text-sm">{{appVersion}}</text>
					<text class="lg text-gray cuIcon-right"></text>
				</view>
			</view>
		</view> -->
		<view class="cell_4 bg-white margin-top-sm" style="padding:20rpx 30rpx; border-radius: 15rpx;">
			<view class="flex justify-between align-center" @click="$util.toUrl('/otherpages/authorize/authorize')">
				<view class="flex justify-center align-center padding-left-xs">
					<text>系统权限管理</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
		</view>
		<view class="padding flex flex-direction" @click="handleToPath(11)">
			<button class="cu-btn bg-red margin-tb-sm lg">退出登录</button>
		</view>
		<u-modal v-model="show" show-cancel-button cancel-text="取消" content="确定退出程序吗?" @confirm="logOut()"
			:mask-close-able="true"></u-modal>

		<u-modal v-model="flag" show-cancel-button cancel-text="取消" content="发现新版本,是否立即更新？" @confirm="confirm"
			:mask-close-able="true"></u-modal>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				authInfo: {},
				show: false,

				appVersion: '1.0.0', // 版本号
				appVersionCode: '100', // 版本号

				flag: false,

				iosUrl: "",
				appUrl: "",
			}
		},
		onLoad() {
			this.getAuthInfo()
			uni.getSystemInfo({
				success: res => {
					this.appVersion = res.appVersion
					this.appVersionCode = res.appVersionCode
				}
			})
		},
		methods: {
			getAuthInfo() {
				let that = this
				this.request.httpTokenRequest({
					url: "user/auth",
					method: "get"
				}, {}).then(res => {
					if (res.code == 0) {
						that.authInfo = res.data
					} else {
						this.$util.msg(res.msg)
						return
					}
				}, error => {})
			},

			handleLeft() {
				uni.navigateBack()
			},

			handleToPath(type) {
				let url = '';
				switch (type) {
					case 1:
						url = '/otherpages/setting/center';
						break;
					case 2:
						url = '/otherpages/setting/auth';
						break;
					case 3:
						url = '/otherpages/setting/address/address';
						break;
					case 4:
						url = '/otherpages/setting/resetPassword';
						break;
					case 5:
						url = '/otherpages/setting/cancel';
						break;
					case 6:
						url = '/otherpages/setting/complaint/complaint';
						break;
					case 7:
						url = '/otherpages/setting/help/help';
						break;
					case 9:
						url = '/otherpages/setting/policy/detail?type=service';
						break;
					case 10:
						url = '/otherpages/setting/policy/detail?type=privacy';
						break;
					case 11:
						this.show = true
						break;
				}
				if (type != 11) {
					uni.navigateTo({
						url: url
					})
				}
			},
			logOut() {
				this.request.httpTokenRequest({
					url: "login/logout",
					method: "get"
				}, {}).then(res => {
					if (res.code == 0) {
						uni.removeStorageSync('token')
						uni.removeStorageSync('user')
						uni.removeStorageSync('authInfo')
						uni.redirectTo({
							url: '/pages/register/register'
						})
					} else {
						this.$util.msg(res.msg)
						return
					}
				}, error => {})
			},
			onUpdata() {
				this.request.httpTokenRequest({
					url: "index/getApkVersion",
					method: "get"
				}, {}).then(res => {
					if (res.code == 0) {
						if (this.appVersionCode < res.data.version) {
							this.flag = true
							this.iosUrl = res.data.ios_path
							this.appUrl = res.data.app_path
						}else {
							this.$util.msg('已经是最新版本啦！')
						}
					} else {
						this.$util.msg(res.msg)
						return
					}
				}, error => {})
			},
			confirm() {
				let that = this
				let os = uni.getStorageSync('osName')
				if (os == 'ios') {
					plus.runtime.openURL(this.iosUrl)
				} else {
					var url = this.appUrl;
					plus.nativeUI.showWaiting("下载更新文件...");
					const downloadTask = uni.downloadFile({
						url: url, //仅为示例，并非真实的资源
						success: (res) => {
							if (res.statusCode === 200) {
								that.installWgt(res.tempFilePath)
							}
						},
						fail: (err) => {
							plus.nativeUI.alert("下载失败！");
						}
					});
				}
			},
			installWgt(path) {
				plus.nativeUI.showWaiting("安装更新文件...");
				plus.runtime.install(path, {
					force: true
				}, function() {
					plus.nativeUI.closeWaiting();
					//更新完成，重启app
					plus.runtime.restart();
				}, function(e) {
					plus.nativeUI.closeWaiting();
					plus.nativeUI.alert("安装更新文件失败[" + e.code + "]：" + e.message);
				});
			},
		}
	}
</script>


<style lang="scss" scoped>
	.my_bg {
		position: absolute;
		left: 0;
		top: 0;
		z-index: -1;
		width: 100%;
	}

	.header_cell {
		margin-top: 100rpx;

		.user_info {
			display: flex;
			justify-content: space-between;
			align-items: center;

			.user_photo {
				width: 120rpx;
				height: 120rpx;
				box-shadow: 0px 0px 10rpx 1px rgba(0, 0, 0, 0.1);
				border-radius: 50%;
				background-color: white;
				margin-right: 20rpx;
			}
		}

		.auth_btn {
			margin: 50rpx auto;
			text-align: center;

			&>button {
				box-shadow: 3px 3px 10rpx 1px rgba(0, 0, 0, 0.2);
				padding-left: 50rpx;
				padding-right: 50rpx;
			}
		}

		.vip_cell {
			margin-top: 40rpx;
			width: 690rpx;
			height: 150rpx;
			// background-image: url('/static/imgs/vip_bg.png');
			background-size: 100% 100%;
			color: white;
			padding: 0 30rpx;

			.invate_btn {
				background-color: rgb(241, 198, 142);
				box-shadow: 3px 3px 10rpx 1px rgba(241, 198, 142, 0.5);
				width: 150rpx;
				color: rgb(99, 71, 56);
				font-weight: bold;
			}
		}
	}

	.cell_1_icon {
		width: 100rpx;
		height: 100rpx;
		background-color: #f4f2f7;
		border-radius: 50%;
		font-size: 50rpx;
		margin: 0 auto;
		margin-bottom: 15rpx;
	}

	.cell_2 {
		&>view {
			background-color: white;
			border-radius: 15rpx;
			text-align: center;
			width: 48%;
			padding: 30rpx 0;
		}

		.cell_2_icon {
			font-size: 60rpx;
			margin-bottom: 15rpx;
		}
	}

	.cell_3_icon {
		font-size: 50rpx;
		margin-bottom: 20rpx;
	}

	.cell_4 {

		&>view,
		navigator {
			padding: 30rpx 0;
		}
	}
</style>